<!-- 学术库内容审核 -->
<template>
  <div>
    <!-- 面包屑导航 -->
    <el-breadcrumb separator-class="el-icon-arrow-right">
      <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item>学术库内容审核</el-breadcrumb-item>
    </el-breadcrumb>
    <div>
      <el-container>
        <el-main>
          <el-row>
            <el-col :span="8">
              <el-input placeholder="请输入内容关键字进行搜索" v-model="searchQuery"></el-input>
            </el-col>
            <el-col :span="4" style="margin-left: 20px;">
              <el-select v-model="selectedStatus" placeholder="请选择状态">
                <el-option v-for="item in statuses" :key="item.value" :label="item.label" :value="item.value"></el-option>
              </el-select>
            </el-col>
            <el-col :span="4">
              <el-button icon="el-icon-search" type="success"  @click="learnDate">搜索</el-button>
            </el-col>
          </el-row>
          <el-table  border :data="filteredData" style="width: 100%">
            <el-table-column  align='center' prop="id" label="ID" width="80"></el-table-column>
            <el-table-column align='center' prop="articleTitle" label="标题"></el-table-column>
            <el-table-column align='center'  prop="contentSummary" label="内容"></el-table-column>
            <el-table-column align='center' prop="status" label="状态" width="120" sortable></el-table-column>
            <el-table-column align='center' label="操作" width="180">
              <template slot-scope="scope">
                <el-button type="info"    @click="editItem(scope.row)">编辑</el-button>
                <el-button v-if="scope.row.status=='待审核'" type="primary"  @click="approveItem(scope.row)"> 审核</el-button>
                <el-button v-if="scope.row.status=='已拒绝'" type="primary"  @click="approveItem(scope.row)"> 重审</el-button>
                <el-button  v-if="scope.row.status=='已审核'" disabled  type="primary"   @click="approveItem(scope.row)"> 已审</el-button>
              </template>
            </el-table-column>
          </el-table>
          <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage"
            :page-sizes="[10, 20, 50, 100]" :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper"
            :total="totalData"></el-pagination>
        </el-main>
      </el-container>
    </div>
  </div>
</template>

<script>
// import {knowledgeData,knowledgeSave,knowledgeDelete } from '../../api/basisMG'
export default {
  data() {
    return {
      searchQuery: '',
      selectedStatus: '',
      statuses: [
        { value: 'pending', label: '待审核' },
        { value: 'approved', label: '已审核' },
        { value: 'rejected', label: '已拒绝' },
      ],
      currentPage: 1,
      pageSize: 10,
      totalData: 0,
      academicData: [], // 学术库内容数据  
      filteredData: [], // 筛选后的数据  
    }
  },
  // 监听 searchQuery 和 selectedStatus 的变化，当它们变化时重新获取数据  
  watch: {
    searchQuery: {
      handler() {
        this.learnDate();
      },
      deep: true,
    },
    selectedStatus(newVal) {
      if (newVal) {
        this.learnDate();
      }
    },
  },
  created() {
    this.getdata()
  },
  methods: {
    // 获取数据列表
    getdata() {
      // 模拟数据开始
      let res = {
        code: 0,
        msg: null,
        count: 43,
        data: [
          {
            "id": 1,
            "articleTitle": "数字虚拟人技术在远程教育中的应用",
            "author": "张三",
            "publicationDate": "2023-03-15",
            "contentSummary": "探讨了数字虚拟人在远程教育中的教学辅助作用，提出了新的教学模式。",
            "academicField": "教育技术",
            'status':'已审核'
          },
          {
            "id": 2,
            "articleTitle": "基于深度学习的虚拟人表情生成算法研究",
            "author": "李四",
            "publicationDate": "2023-02-20",
            "contentSummary": "设计并实现了一种基于深度学习框架的虚拟人表情生成方法，提高了表情的真实性。",
            "academicField": "计算机视觉",
            'status':'已审核'
          },
          {
            "id": 3,
            "articleTitle": "虚拟人行为模拟在人机交互中的应用分析",
            "author": "王五",
            "publicationDate": "2023-01-10",
            "contentSummary": "分析了虚拟人行为模拟在提升人机交互体验方面的作用，并提出了优化建议。",
            "academicField": "人机交互",
            'status':'已审核'
          },
          {
            "id": 4,
            "articleTitle": "数字虚拟人语音合成技术研究进展",
            "author": "赵六",
            "publicationDate": "2022-12-01",
            "contentSummary": "综述了近年来数字虚拟人语音合成技术的研究现状和发展趋势。",
            "academicField": "语音技术",
            'status':'已拒绝'
          },
          {
            "id": 5,
            "articleTitle": "基于AI的数字虚拟人情感识别系统",
            "author": "孙七",
            "publicationDate": "2022-11-15",
            "contentSummary": "构建了一个基于人工智能的数字虚拟人情感识别系统，实现了对用户情绪的准确识别。",
            "academicField": "人工智能",
            'status':'待审核'
          },
          {
            "id": 6,
            "articleTitle": "数字虚拟人在医疗领域的应用探索",
            "author": "周八",
            "publicationDate": "2022-10-20",
            "contentSummary": "探讨了数字虚拟人在医疗咨询、康复训练等方面的应用潜力和挑战。",
            "academicField": "医疗技术",
            'status':'待审核'
          },
          {
            "id": 7,
            "articleTitle": "数字虚拟人实时渲染技术研究",
            "author": "吴九",
            "publicationDate": "2022-09-10",
            "contentSummary": "研究了数字虚拟人实时渲染的关键技术，提高了虚拟人的渲染质量和效率。",
            "academicField": "计算机图形学",
            'status':'待审核'
          },
          {
            "id": 8,
            "articleTitle": "基于深度神经网络的虚拟人动作捕捉系统",
            "author": "郑十",
            "publicationDate": "2022-08-15",
            "contentSummary": "设计了一种基于深度神经网络的虚拟人动作捕捉系统，实现了对真实人体动作的准确捕捉和转换。",
            "academicField": "运动捕捉",
            'status':'待审核'
          },
          {
            "id": 9,
            "articleTitle": "数字虚拟人面部细节生成算法优化",
            "author": "陈十一",
            "publicationDate": "2022-07-01",
            "contentSummary": "针对数字虚拟人面部细节生成算法进行了优化，提升了虚拟人面部表情的自然度和逼真度。",
            "academicField": "计算机图形学",
            'status':'待审核'
          },
          {
            "id": 10,
            "articleTitle": "数字虚拟人智能问答系统的设计与实现",
            "author": "刘十二",
            "publicationDate": "2022-06-15",
            "contentSummary": "构建了一个具有智能问答功能的数字虚拟人系统，实现了与用户的自然语言交互。",
            "academicField": "自然语言处理",
            'status':'待审核'
          }

        ]
      }
      this.filteredData = res.data
    
      this.totalData = this.filteredData.length;
      // 正式环境环境 调用接口
      // this.learnDate()
    },
    learnDate() {
      // 这里我们仅模拟数据  
      this.filteredData = this.academicData.filter(item => {
        return (
          item.title.includes(this.searchQuery) &&
          item.status === this.selectedStatus
        );
      });
      this.totalData = this.filteredData.length;
      // 根据当前页码和每页数量来截取数据  
      this.filteredData = this.filteredData.slice(
        (this.currentPage - 1) * this.pageSize,
        this.currentPage * this.pageSize
      );
    },
    handleSizeChange(val) {
      this.pageSize = val;
      this.learnDate();
    },
    handleCurrentChange(val) {
      this.currentPage = val;
      this.learnDate();
    },
    // 编辑
    editItem(item) {
    if (!item || !item.id) {  
        throw new Error('Invalid item. Item ID is required.');  
    }  
  

    if (!currentUser.isAdmin) {  
        throw new Error('You do not have permission to edit items.');  
    }  
   
    const allowedFieldsToUpdate = ['name', 'description', 'category']; // 允许编辑的字段  
    const fieldsToUpdate = Object.keys(item).filter(field => allowedFieldsToUpdate.includes(field));  
    if (fieldsToUpdate.length === 0) {  
        throw new Error('No valid fields to update.');  
    } 
    const updatedItem = updateItemInDatabase(item.id, { ...item, fieldsToUpdate });  
  
    return updatedItem;  
    },
    // 审核
    approveItem(item) {
      if (!item || !item.id) {  
        throw new Error('Invalid item');  
    }  
    if (!currentUser.isAdmin) {  
        throw new Error('You do not have permission to approve items');  
    }  
    updateItemStatus(item.id, 'approved'); 
    console.log(`Item ${item.id} has been approved.`);  
    return {  
        status: 'approved',  
        itemId: item.id  
    };  
    },

  }
}
</script>

<style scoped>
.el-pagination,.el-table{
  margin-top: 20px;
}
.el-button{
  margin-left: 0px !important;
}
</style>

 
 